<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:p="http://primefaces.prime.com.tr/ui"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:comp="http://facelets.mycomponents.com">
<h:head>
    <title>ScrumApp</title>
    <link type="text/css" rel="stylesheet" href="resources/css/style.css" />
    <link type="text/css" rel="stylesheet" href="resources/css/theme.css"/>
    <link type="text/css" rel="stylesheet" href="resources/css/primefacesSkin.css"/>
    <script type="JavaScript" src="scripts/handleDialogComplete.js"></script>
    <script type="JavaScript" src="scripts/limitTextArea.js"></script>
</h:head>

<h:body>
    <f:view locale="#{Language.locale}">
        <f:loadBundle basename="resources.messages.Messages" var="msgBundle"/>
        <div id="container">
            <div id="header">
                <h2>ScrumApp</h2>
                <div id="topmenu">
                    <ul>
                        <li><a href="/ScrumApp/faces/Project.xhtml">#{msgBundle.project}</a></li>
                        <li class="current"><a href="/ScrumApp/faces/ProductBacklog.xhtml">#{msgBundle.product_backlog}</a></li>
                        <li><a href="/ScrumApp/faces/SprintBacklog.xhtml">#{msgBundle.sprint_backlog}</a></li>
                        <li><a href="/ScrumApp/faces/SprintList.xhtml">#{msgBundle.sprint_list}</a></li>
                        <li><a href="/ScrumApp/faces/Impediments.xhtml">#{msgBundle.impediments}</a></li>
                        <li><a href="/ScrumApp/faces/People.xhtml">#{msgBundle.people}</a></li>
                        <li><a href="/ScrumApp/faces/Charts.xhtml">#{msgBundle.charts}</a></li>
                        <li><a href="/ScrumApp/faces/Taskboard.xhtml">Task Board</a></li>
                    </ul>
                </div>
            </div>
            <div id="top-panel">
                <h:form id="frmChooseProject" styleClass="form" >
                    <a style="margin-left: 10px;" href="/ScrumApp/faces/ProductBacklog.xhtml">
                        <h:outputText style="font-weight: bold" value="← #{msgBundle.back}"/>
                    </a>
                    <a style="margin-left: 180px;" href="/ScrumApp/faces/ProductBacklog.xhtml">#{msgBundle.product_backlog}</a>
                    <h:outputText style="font-weight: bold" value=" → #{msgBundle.manage_tasks}"/>
                    <comp:chooseLanguage/>
                </h:form>
            </div>

            <div id="content">

                <h:form prependId="false" styleClass="form">
                    <div class="extendedbox" align="center" >
                        <h3>
                            <h:outputText value="#{msgBundle.tasks}" />
                            <p:commandLink oncomplete="createDialog.show();" update="createPanel" value="#{msgBundle.add_new_task}" styleClass="add" type="button" />
                        </h3>
                        <br/>
                        <table width="95%" class="dataTable" >
                            <tr align="center" class="header">
                                <td>#{msgBundle.priority}</td>
                                <td>#{msgBundle.description}</td>
                                <td>#{msgBundle.comments}</td>
                            </tr>
                            <tr align="center">
                                <td>#{msgBundle[taskBean.product.priority.description]}</td>
                                <td>#{taskBean.product.description}</td>
                                <td>#{taskBean.product.comments}</td>
                            </tr>
                        </table>
                        <div style="font-size: 10px" >
                            <br/>
                            <p:dataTable id="taskDatatable" var="item" value="#{taskBean.byproduct}"
                                         paginator="true" rows="10" emptyMessage="#{msgBundle.no_records_found}"  style="width: 95%" >
                                <p:column style="width:16px"><p:rowToggler/></p:column>

                                <p:column>
                                    <f:facet name="header">#{msgBundle.description}</f:facet>
                                    <h:outputText value="#{item.description}" />
                                </p:column>

                                <p:column style="width:150px">
                                    <f:facet name="header">#{msgBundle.assign_to}</f:facet>
                                    <h:outputText value="#{item.user.lastName}, #{item.user.firstName}" />
                                </p:column>

                                <p:column style="width:50px">
                                    <f:facet name="header">#{msgBundle.status}</f:facet>
                                    <h:outputText value="#{msgBundle[item.status.description]}" />
                                </p:column>

                                 <p:column style="width:45px">
                                    <p:commandButton title="#{msgBundle.edit}" update="editPanel" oncomplete="editDialog.show()" style=" width: 20px; height: 20px; border: transparent;  background:transparent url(images/pencil.png) no-repeat bottom;">
                                        <f:setPropertyActionListener value="#{item}" target="#{taskBean.selectedtask}" />
                                    </p:commandButton>

                                     <p:commandButton title="#{msgBundle.delete}" oncomplete="deleteDialog.show()" style="width: 20px; height: 20px; border: transparent;  background:transparent url(images/trashcan.png) no-repeat bottom;" >
                                        <f:setPropertyActionListener value="#{item}" target="#{taskBean.selectedtask}" />
                                    </p:commandButton>

                                </p:column>

                                <f:facet name="expansion">
                                    <div class="ui-widget-content" id="expand" style=" width: 670px; padding: 5px " >
                                        <table width="95%" class="dataTable" >
                                            <tr align="center" class="header" >
                                                <td>#{msgBundle.start_date}</td>
                                                <td>#{msgBundle.end_date}</td>
                                                <td>#{msgBundle.estimated_effort}</td>
                                            </tr>
                                            <tr align="center">
                                                <td><h:outputText value="#{item.start}" converter="CustomDateTimeConverter">
                                                    </h:outputText></td>
                                                <td><h:outputText value="#{item.end}" converter="CustomDateTimeConverter">
                                                    </h:outputText></td>
                                                <td><h:outputText value="#{item.estimatedEffort}">
                                                        <f:convertNumber type="number"/>
                                                    </h:outputText></td>
                                            </tr>
                                        </table>
                                        <h1 style=" margin: 7px">#{msgBundle.comments}</h1>
                                        <table width="95%" class="comments">
                                            <tr>
                                                <td>
                                                    <h:outputText value="#{item.comments}"/></td>
                                            </tr>
                                        </table>
                                    </div>
                                </f:facet>
                            </p:dataTable>
                            <br/>
                        </div>
                    </div>

                </h:form>
                <h:form prependId="false" styleClass="form">
                    <p:dialog header="#{msgBundle.create_task}" widgetVar="createDialog" modal="true"
                              resizable="false"  width="670" height="400" draggable="rue" >
                        <h:panelGrid id="createPanel" columns="2" cellpadding="4">
                            <h:outputText value="#{msgBundle.description}: *"/>
                            <h:inputText maxlength="50" style="width:350px" value="#{taskBean.newtask.description}" required="true" />
                            <h:outputText value="#{msgBundle.assign_to}:"/>
                            <h:selectOneMenu style="width:200px" converter="UserConverter" value="#{taskBean.newtask.user}">
                                <f:selectItem itemValue="" itemLabel="" />
                                <f:selectItems value="#{personBean.activeusers}" var="object" itemLabel="#{object.lastName}, #{object.firstName}" itemValue="#{object}" />
                            </h:selectOneMenu>
                            <h:outputText value="#{msgBundle.status}:"/>
                            <h:selectOneMenu converter="StatusConverter" value="#{taskBean.newtask.status}">
                                <f:selectItems value="#{statusBean.allTaskStatus}" var="object" itemLabel="#{msgBundle[object.description]}" itemValue="#{object}" />
                            </h:selectOneMenu>
                            <h:outputText value="#{msgBundle.start_date}:"/>
                            <p:inputMask value="#{taskBean.newtask.start}" converter="CustomDateTimeConverter" style="width: 80px" mask="99/99/9999">
                            </p:inputMask>
                            <h:outputText value="#{msgBundle.end_date}:"/>
                            <p:inputMask value="#{taskBean.newtask.end}" converter="CustomDateTimeConverter" style="width: 80px" mask="99/99/9999">
                            </p:inputMask>
                            <h:outputText value="#{msgBundle.estimated_effort}:"/>
                            <h:inputText value="#{taskBean.newtask.estimatedEffort}" onkeyup="this.value = this.value.replace (/\D+/, '')">
                                <f:convertNumber type="number"/>
                            </h:inputText>
                            <h:outputText value="#{msgBundle.comments}:"/>
                            <h:inputTextarea style="width:350px" value="#{taskBean.newtask.comments}"
                                             onkeyup="limitTextArea(this,500);" onkeydown="limitTextArea(this,500);"/>
                            <p:commandButton value="#{msgBundle.submit}" style=" margin-top: 10px; font-weight: bold"
                                             action="#{taskBean.submitCreate}"  oncomplete="createDialogComplete(xhr, status, args)" />
                            <p:commandButton value="#{msgBundle.cancel}" style=" margin-top: 10px; font-weight: bold"
                                             onclick="createDialog.hide()"/>
                        </h:panelGrid>
                    </p:dialog>

                </h:form>
                <h:form prependId="false" styleClass="form">
                    <p:dialog header="#{msgBundle.edit_task}" widgetVar="editDialog" resizable="false" modal="true"
                              width="670" height="400" draggable="true" >
                        <h:panelGrid id="editPanel" columns="2" cellpadding="4">
                            <h:outputText value="#{msgBundle.description}: *"/>
                            <h:inputText maxlength="50" style="width:350px" value="#{taskBean.selectedtask.description}" required="true" />
                            <h:outputText value="#{msgBundle.assign_to}:"/>
                            <h:selectOneMenu style="width:200px" converter="UserConverter" value="#{taskBean.selectedtask.user}">
                                <f:selectItem itemValue="" itemLabel="" />
                                <f:selectItems value="#{personBean.activeusers}" var="object" itemLabel="#{object.lastName}, #{object.firstName}" itemValue="#{object}" />
                            </h:selectOneMenu>
                            <h:outputText value="#{msgBundle.status}:"/>
                            <h:selectOneMenu converter="StatusConverter" value="#{taskBean.selectedtask.status}">
                                <f:selectItems value="#{statusBean.allTaskStatus}" var="object" itemLabel="#{msgBundle[object.description]}" itemValue="#{object}" />
                            </h:selectOneMenu>
                            <h:outputText value="#{msgBundle.start_date}:"/>
                            <p:inputMask value="#{taskBean.selectedtask.start}" converter="CustomDateTimeConverter" style="width: 80px" mask="99/99/9999">
                            </p:inputMask>
                            <h:outputText value="#{msgBundle.end_date}:"/>
                            <p:inputMask value="#{taskBean.selectedtask.end}" converter="CustomDateTimeConverter" style="width: 80px" mask="99/99/9999">
                            </p:inputMask>
                            <h:outputText value="#{msgBundle.estimated_effort}:"/>
                            <h:inputText value="#{taskBean.selectedtask.estimatedEffort}" onkeyup="this.value = this.value.replace (/\D+/, '')">
                                <f:convertNumber type="number"/>
                            </h:inputText>
                            <h:outputText value="#{msgBundle.comments}:"/>
                            <h:inputTextarea style="width:350px" value="#{taskBean.selectedtask.comments}"
                                             onkeyup="limitTextArea(this,500);" onkeydown="limitTextArea(this,500);"/>
                            <p:commandButton value="#{msgBundle.submit}" style=" margin-top: 10px; font-weight: bold"
                                             update="taskDatatable" action="#{taskBean.submitEdit}" oncomplete="editDialogComplete(xhr, status, args)" />
                            <p:commandButton value="#{msgBundle.cancel}" style=" margin-top: 10px; font-weight: bold"
                                             onclick="editDialog.hide()"/>
                        </h:panelGrid>
                    </p:dialog>

                </h:form>
                <h:form prependId="false" styleClass="form">
                    <p:dialog header="#{msgBundle.delete_task}" widgetVar="deleteDialog" modal="true" resizable="false" draggable="true"  width="450">
                        <table width="100%" style="height: 100px; text-align: left" id="deletePanel">
                            <tr>
                                <td colspan="2" align="center" ><h:outputText value="#{msgBundle.are_you_sure_task}" /></td></tr>
                            <tr>
                                <td align="right" >
                                    <p:commandButton value="#{msgBundle.yes}" style=" font-weight: bold"
                                                     update="taskDatatable"  action="#{taskBean.submitDelete}" oncomplete="deleteDialog.hide()" /></td>
                                <td><p:commandButton value="#{msgBundle.no}" style=" font-weight: bold"
                                                     onclick="deleteDialog.hide()" /></td></tr>
                        </table>
                    </p:dialog>


                </h:form>
            </div>
            <div id="footer">
                <div id="credits">Template based on another by <a href="http://www.bloganje.com">Bloganje</a>
                </div>
                <br />
            </div>
        </div>
    </f:view>
</h:body>
</html>
